@inherits RenderViewPage
@using Umbraco.Cms.Web
<link href="http://cdn.pbdesk.com/skins/rambling/slider.css" rel="stylesheet" type="text/css" />     
<script type="text/javascript" src="http://cdn.pbdesk.com/plugins/easingpack/jquery-easing-1.3.pack.js"></script>
<script type="text/javascript" src="http://cdn.pbdesk.com/plugins/easingpack/jquery-easing-compatibility.1.2.pack.js"></script>
<script type="text/javascript" src="http://cdn.pbdesk.com/scripts/coda-slider.1.1.1.pack.js"></script>    
    <script type="text/javascript">
  
    var theInt = null;
    var $crosslink, $navthumb;
    var curclicked = 0;
    
    theInterval = function(cur){
      clearInterval(theInt);
      
      if( typeof cur != 'undefined' )
        curclicked = cur;
      
      $crosslink.removeClass("active-thumb");
      $navthumb.eq(curclicked).parent().addClass("active-thumb");
        $(".stripNav ul li a").eq(curclicked).trigger('click');
      
      theInt = setInterval(function(){
        $crosslink.removeClass("active-thumb");
        $navthumb.eq(curclicked).parent().addClass("active-thumb");
        $(".stripNav ul li a").eq(curclicked).trigger('click');
        curclicked++;
        if( 5 == curclicked )
          curclicked = 0;
        
      }, 4000);
    };
    
    $(function(){
      
      $("#main-photo-slider").codaSlider();
      
      $navthumb = $(".nav-thumb");
      $crosslink = $(".cross-link");
      
      $navthumb
      .click(function() {
        var $this = $(this);
        theInterval($this.parent().attr('href').slice(1) - 1);
        return false;
      });
      
      theInterval();
    });
  </script>
<div class="portfolio_preview">
	  <h2>My Realm</h2>
	  <div id="from_portfolio">
		<div class="slider-wrap">
		  <div id="main-photo-slider" class="csw">
            		<div class="panelContainer">
               
             <div title="Panel 1" class="panel"><img src="http://pbdeskcdn.appspot.com/images/slider/WelCome.png" alt="temp" width="501" height="158" />
<div class="photo-meta-data">My WebSites:<br /> <span>www.PBDesk.com and blog.PBDesk.com</span></div>
</div>
<div title="Panel 2" class="panel"><img src="http://pbdeskcdn.appspot.com/images/slider/MyBlogs.png" alt="temp" width="501" height="158" />
<div class="photo-meta-data">Pinal Bhatt"s Blog - Learning endeavor for ever.....<br /> <span>http://blog.PBDesk.com</span></div>
</div>
<div title="Panel 3" class="panel"><img src="http://pbdeskcdn.appspot.com/images/slider/MySocials.png" alt="scotch egg" width="501" height="158" />
<div class="photo-meta-data">Find me on following social networks!<br /> <span>Facebook, Twitter, Google, Yahoo, LinkedIN... and many more</span></div>
</div>
<div title="Panel 5" class="panel"><img src="/portf_thumbs/ramblingsoul.jpg" alt="scotch egg" width="501" height="158" />
<div class="photo-meta-data">Project : RamblingSoul.com<br /> <span>Scope of work : PHP, MySQL, WebDesign, Wordpress and SEO</span></div>
</div>
               
            		</div>
          	  </div>
          <div id="movers-row"></div>
		</div>
	  </div>
    </div>